<template>
    <div v-loading="loading">
        <el-card>
            <template #header>
                权限列表
                <el-button type="text" @click="$router.push({ name: 'PoliciesAdd' })">添加</el-button>
            </template>
            <el-table :data="policies.result" border stripe>
                <el-table-column prop="group" label="分组"> </el-table-column>
                <el-table-column prop="desc" label="路由描述"> </el-table-column>
                <el-table-column prop="path" label="路由"></el-table-column>
                <el-table-column label="操作">
                    <template #default="{ row }">
                        <el-button type="text" @click="delPolicies(row._id)">
                            删除</el-button>
                        <el-button type="text" @click="editPolicies(row._id)">
                            编辑</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>
  
<script>
import { gainPolicies, delPolicies } from "@/api/policies";
export default {
    data() {
        return {
            loading: false,
            policies: {},
            perPage: 10,
            page: 1,
        };
    },
    async created() {
        await this.gainPolicies();
    },
    methods: {
        editPolicies(id) {
            this.$router.push({ name: 'PoliciesEdit', query: { id } })
        },
        async delPolicies(id) {
            try {
                await this.$confirm('确定删除吗', '提示')
                this.loading = true
                await delPolicies(id);
                await this.gainPolicies();
            } catch (error) { }
            this.loading = false
        },
        //获取
        async gainPolicies() {
            const { data } = await gainPolicies({
                page: this.page,
                perPage: this.perPage,
            });
            this.policies = data;
        },
    },
};
</script>
  